<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="custom-image" content="https://totemlife.cn/apps/public/trial-home-cover.jpg">
    <title>受试者详情(测试)</title>
    <link href="/apps/css/bootstrap.min.css" rel="stylesheet">
    <link href="/apps/css/fontawesome-free-6.4.0-web/css/all.css" rel="stylesheet">
    <script src="/apps/js/baidu-tongji-mtx.js"></script>
</head>
<body>
    <div class="container py-4">
        <div class="row mb-4">
            <div class="col">
                <h2>
                    <a href="/apps/trial" class="text-decoration-none">临床研究支持</a>
                    <i class="bi bi-chevron-right"></i>
                    <a href="/apps/trial/admin/trials/{{trial.id}}/subjects" class="text-decoration-none">受试者管理</a>
                    <i class="bi bi-chevron-right"></i>
                    受试者详情
                </h2>
            </div>
        </div>

        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">基本信息</h5>
                <div class="row">
                    <div class="col-md-3">
                        <p class="mb-1">
                            <strong>姓名：</strong>{{subject.real_name}}
                            <small class="text-muted">(UID: {{subject.user_id}})</small>
                        </p>
                        <p class="mb-1"><strong>手机：</strong>{{subject.phone}}</p>
                        <p class="mb-1">
                            <strong>状态：</strong>
                            <span class="badge {{#if (eq subject.status 0)}}bg-secondary
                                {{else if (eq subject.status 1)}}bg-info
                                {{else if (eq subject.status 2)}}bg-primary
                                {{else if (eq subject.status 3)}}bg-success
                                {{else if (eq subject.status 4)}}bg-danger
                                {{else}}bg-dark{{/if}}">
                                {{subject.status_text}}
                            </span>
                        </p>
                    </div>
                    <div class="col-md-3">
                        <p class="mb-1"><strong>创建时间：</strong>{{formatDate subject.created_at "YYYY-MM-DD HH:mm:ss"}}</p>
                        <p class="mb-1"><strong>报名时间：</strong>{{formatDate subject.apply_time "YYYY-MM-DD HH:mm:ss"}}</p>
                        <p class="mb-1"><strong>入组时间：</strong>{{formatDate subject.entry_time "YYYY-MM-DD HH:mm:ss"}}</p>
                    </div>
                </div>
            </div>
        </div>

        <!-- 添加管理动作卡片 -->
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">管理动作</h5>
                <div class="d-flex flex-wrap gap-2">
                    {{#if (eq subject.status 1)}}
                    <button type="button" class="btn btn-danger"
                            data-bs-toggle="modal"
                            data-bs-target="#cancelModal">
                        <i class="fas fa-times-circle me-1"></i>取消报名
                    </button>
                    {{/if}}

                    {{#if (eq subject.status 2)}}
                    <button type="button" class="btn btn-primary"
                            data-bs-toggle="modal"
                            data-bs-target="#groupModal"
                            data-subject-id="{{subject.id}}"
                            data-subject-name="{{subject.real_name}}">
                        <i class="fas fa-users me-1"></i>设置分组
                    </button>
                    <button type="button" class="btn btn-danger"
                            data-bs-toggle="modal"
                            data-bs-target="#cancelModal">
                        <i class="fas fa-times-circle me-1"></i>取消报名
                    </button>
                    {{/if}}

                    {{#if (eq subject.status 3)}}
                    <button type="button" class="btn btn-danger"
                            data-bs-toggle="modal"
                            data-bs-target="#exitModal">
                        <i class="fas fa-sign-out-alt me-1"></i>退出试验
                    </button>

                    <button type="button" class="btn btn-success"
                            data-bs-toggle="modal"
                            data-bs-target="#finishModal">
                        <i class="fas fa-check-circle me-1"></i>完成试验
                    </button>

                    <a href="/apps/trial/diary/list/{{trial.id}}?subject_id={{subject.id}}"
                       class="btn btn-info"
                       target="_blank">
                        <i class="fas fa-book me-1"></i>查看日记
                    </a>
                    {{/if}}

                    <button type="button" class="btn btn-secondary"
                            data-bs-toggle="modal"
                            data-bs-target="#profileModal">
                        <i class="fas fa-comment me-1"></i>备注档案
                    </button>
                </div>
            </div>
        </div>

        {{#if subject.apply_info}}
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">报名信息</h5>
                <div class="row g-3">
                    {{#with (parseJson subject.apply_info)}}
                    <div class="col-md-4">
                        <p class="mb-1"><strong>受试者姓名：</strong>{{subject_name}}</p>
                        <p class="mb-1"><strong>性别：</strong>{{#if (eq gender "1")}}男{{else}}女{{/if}}</p>
                        <p class="mb-1"><strong>出生日期：</strong>{{birth_date}}</p>
                        <p class="mb-1"><strong>年龄：</strong>{{age}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1"><strong>是否确诊：</strong>{{#if (eq is_diagnosed "1")}}是{{else}}否{{/if}}</p>
                        <p class="mb-1"><strong>确诊日期：</strong>{{diagnosis_date}}</p>
                        <p class="mb-1"><strong>计划就诊：</strong>{{planned_visit_date}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1"><strong>联系人姓名：</strong>{{contact_name}}</p>
                        <p class="mb-1"><strong>监护关系：</strong>{{contact_relation}}</p>
                        <p class="mb-1"><strong>联系电话：</strong>{{contact_phone}}</p>
                    </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>常住地址：</strong></span> <span class="text-muted">{{contact_address}}</span> </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>申请理由：</strong></span> <span class="text-muted">{{apply_reason}}</span> </div>
                    <div class="col-md-12">
                        <span class="mb-1"><strong>确诊报告：</strong></span>
                        <span class="d-flex flex-wrap gap-2">
                            {{#each (parseJson diagnosis_files)}}
                            <a href="{{this}}" target="_blank" class="btn btn-sm btn-outline-primary">
                                <i class="fas fa-file"></i> 查看文件
                            </a>
                            {{/each}}
                        </span>
                    </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>既往病史：</strong></span> <span class="text-muted">{{medical_history}}</span> </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>过敏历史：</strong></span> <span class="text-muted">{{allergy_history}}</span> </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>治疗方案：</strong></span> <span class="text-muted">{{recent_treatment}}</span> </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>治疗机构：</strong></span> <span class="text-muted">{{treatment_hospital}}</span> </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>康复方案：</strong></span> <span class="text-muted">{{recent_recover}}</span> </div>
                    <div class="col-md-6"> <span class="mb-1"><strong>康复机构：</strong></span> <span class="text-muted">{{recover_institution}}</span> </div>
                    {{/with}}
                </div>
            </div>
        </div>
        {{/if}}

        {{#if subject.entry_info}}
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">入组信息</h5>
                <div class="row g-3">
                    {{#with (parseJson subject.entry_info)}}
                    <div class="col-md-4">
                        <p class="mb-1"><strong>受试者姓名：</strong>{{subject_name}}</p>
                        <p class="mb-1"><strong>性别：</strong>{{#if (eq subject_gender "1")}}男{{else}}女{{/if}}</p>
                        <p class="mb-1"><strong>出生日期：</strong>{{subject_birth_date}}</p>
                        <p class="mb-1"><strong>年龄：</strong>{{age}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1"><strong>联系人姓名：</strong>{{guardian_name}} {{recipient_name}}</p>
                        <p class="mb-1"><strong>联系人电话：</strong>{{guardian_phone}} {{recipient_phone}}</p>
                        <p class="mb-1"><strong>与受试人关系：</strong>{{guardian_relation}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1"><strong>收件地址：</strong></p>
                        <p class="text-muted mb-1">{{shipping_address.province}}{{shipping_address.detail}} {{recipient_address}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1"><strong>ADOS评分：</strong>{{ados_score}}</p>
                        <p class="mb-1"><strong>ABC评分：</strong>{{abc_score}}</p>
                        <p class="mb-1"><strong>CARS评分：</strong>{{cars_score}}</p>
                        <p class="mb-1"><strong>GSRS评分：</strong>{{gsrs_score}}</p>
                    </div>
                    <div class="col-12">
                        <p class="mb-1"><strong>入组通知书：</strong></p>
                        <div class="d-flex flex-wrap gap-2">
                            {{#each (parseJson consent_files)}}
                            <a href="{{this}}" target="_blank" class="btn btn-sm btn-outline-primary">
                                <i class="fas fa-file"></i> 查看文件
                            </a>
                            {{/each}}
                        </div>
                    </div>
                    <div class="col-12">
                        <p class="mb-1"><strong>ADOS/ABC/CARS/GSRS量表文件：</strong></p>
                        <div class="d-flex flex-wrap gap-2">
                            {{#each (parseJson scale_files)}}
                            <a href="{{this}}" target="_blank" class="btn btn-sm btn-outline-primary">
                                <i class="fas fa-file"></i> 查看文件
                            </a>
                            {{/each}}
                        </div>
                    </div>
                    <div class="col-12">
                        <p class="mb-1"><strong>知情同意确认：</strong></p>
                        <ul class="list-unstyled text-muted small">
                            <li>
                                <i class="fas {{#if consent_check1}}fa-check text-success{{else}}fa-times text-danger{{/if}} me-1"></i>
                                已了解本试验的目的方法和可能的风险收益
                            </li>
                            <li>
                                <i class="fas {{#if consent_check2}}fa-check text-success{{else}}fa-times text-danger{{/if}} me-1"></i>
                                同意参与本试验并遵从相关自动退组的约定
                            </li>
                            <li>
                                <i class="fas {{#if consent_check3}}fa-check text-success{{else}}fa-times text-danger{{/if}} me-1"></i>
                                同意收集和使用提供的信息用于本试验研究
                            </li>
                            <li>
                                <i class="fas {{#if consent_check4}}fa-check text-success{{else}}fa-times text-danger{{/if}} me-1"></i>
                                同意在某些条件下以运费到付的方式接收试验用品
                            </li>
                        </ul>
                    </div>
                    {{/with}}
                </div>
            </div>
        </div>
        {{/if}}

        {{#if subject.group_info}}
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="alert-heading mb-2">分组信息</h6>
                <div class="row g-3">
                    <div class="col-md-4">
                        <p class="mb-1"><strong>入组编号：</strong>{{subject.group_no}}</p>
                        <p class="mb-1"><strong>分组类型：</strong>{{subject.group_type_text}}</p>
                        <p class="mb-1"><strong>分组时间：</strong>{{formatDate subject.group_time "YYYY-MM-DD HH:mm:ss"}}</p>
                    </div>
                    <div class="col-md-8">
                        {{#if subject.group_note}}
                        <p class="mb-1"><strong>分组备注：</strong></p>
                        <p class="mb-0 text-muted">{{subject.group_note}}</p>
                        {{/if}}
                    </div>
                </div>
                {{#if subject.group_info}}
                <hr>
                <h6 class="mb-2">分组提示</h6>
                <div class="group-info">
                    {{{subject.group_info}}}
                </div>
                {{/if}}
            </div>
        </div>
        {{/if}}

        {{#if (eq subject.status 3)}}
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">参试日志</h5>
                <div class="text-center">
                    <a href="/apps/trial/diary/list/{{trial.id}}?subject_id={{subject.id}}"
                       class="btn btn-primary"
                       target="_blank">
                        <i class="fas fa-book me-1"></i>查看日记记录
                    </a>
                </div>
            </div>
        </div>
        {{/if}}

        <!-- 补给信息管理 -->
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">补给信息管理</h5>

                {{#if supplyInfo}}
                <div class="row mb-3">
                    <div class="col-md-4">
                        <p class="mb-1"><strong>收件人：</strong>{{supplyInfo.recipient_name}}</p>
                        <p class="mb-1"><strong>联系电话：</strong>{{supplyInfo.recipient_phone}}</p>
                        <p class="mb-1"><strong>收货地址：</strong>{{supplyInfo.recipient_address}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1">
                            <strong>状态：</strong>
                            <span class="badge {{#if (eq supplyInfo.status 'pending')}}bg-warning
                                {{else if (eq supplyInfo.status 'shipped')}}bg-info
                                {{else if (eq supplyInfo.status 'delivered')}}bg-success
                                {{else}}bg-secondary{{/if}}">
                                {{#if (eq supplyInfo.status "pending")}}待发货{{/if}}
                                {{#if (eq supplyInfo.status "shipped")}}已发货{{/if}}
                                {{#if (eq supplyInfo.status "delivered")}}已送达{{/if}}
                            </span>
                        </p>
                        <p class="mb-1"><strong>物资名称：</strong>{{supplyInfo.product_name}}</p>
                        <p class="mb-1"><strong>物流单号：</strong>{{supplyInfo.tracking_number}}</p>
                    </div>
                    <div class="col-md-4">
                        <p class="mb-1"><strong>创建时间：</strong>{{formatDate supplyInfo.created_at "YYYY-MM-DD HH:mm:ss"}}</p>
                        <p class="mb-1"><strong>更新时间：</strong>{{formatDate supplyInfo.updated_at "YYYY-MM-DD HH:mm:ss"}}</p>
                    </div>
                </div>

                <div class="text-center">
                    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#updateSupplyModal">
                        <i class="fas fa-edit me-1"></i>更新补给信息
                    </button>
                </div>
                {{else}}
                <div class="alert alert-info">
                    该受试者尚未设置补给地址
                </div>
                {{/if}}
            </div>
        </div>

        <!-- 备注档案卡片 -->
        <div class="card mb-4">
            <div class="card-body">
                <h5 class="card-title">备注档案</h5>
                <div class="mb-3 text-end">
                    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#profileModal">
                        <i class="fas fa-plus me-1"></i>添加备注
                    </button>
                </div>

                <div id="profiles-list">
                    <div class="d-flex justify-content-center">
                        <div class="spinner-border text-primary" role="status">
                            <span class="visually-hidden">加载中...</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

    <!-- 等待分组须知模态框 -->
    <div class="modal fade" id="confirmTipModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">等待分组须知</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    {{{trial.confirm_tip}}}
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-bs-dismiss="modal">我已了解</button>
                </div>
            </div>
        </div>
    </div>

    <!-- 分组设置模态框 -->
    <div class="modal fade" id="groupModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">设置分组</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <form id="groupForm">
                        <input type="hidden" name="subjectId" id="subjectId" value="{{subject.id}}">
                        <div class="mb-3">
                            <label class="form-label">入组编号</label>
                            <input type="text" class="form-control" name="groupNo" required>
                            <div class="form-text">请输入受试者的入组编号</div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">选择分组</label>
                            <select class="form-select" name="groupType" required>
                                <option value="">请选择分组</option>
                                <option value="1">试验组</option>
                                <option value="2">对照组</option>
                                <option value="9">观察员</option>
                                <option value="0">未分组</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">分组备注</label>
                            <textarea class="form-control" name="groupNote" rows="3"></textarea>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" onclick="submitGroup()">确定</button>
                </div>
            </div>
        </div>
    </div>

    <!-- 退出试验模态框 -->
    <div class="modal fade" id="exitModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <form id="exitForm">
                    <div class="modal-header">
                        <h5 class="modal-title">退出试验</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3">
                            <label class="form-label">退出原因</label>
                            <select class="form-select" name="exitReason" required>
                                <option value="">请选择退出原因</option>
                                <option value="adverse_event">出现不良反应</option>
                                <option value="personal">个人原因</option>
                                <option value="protocol_violation">违反试验方案</option>
                                <option value="lost_followup">失访</option>
                                <option value="other">其他原因</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">详细说明</label>
                            <textarea class="form-control" name="exitDescription" rows="3" required></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-danger" onclick="submitExit()">确认退出</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- 完成试验模态框 -->
    <div class="modal fade" id="finishModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <form id="finishForm">
                    <div class="modal-header">
                        <h5 class="modal-title">完成试验</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3">
                            <label class="form-label">完成总结</label>
                            <textarea class="form-control" name="finishSummary" rows="3" required></textarea>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">效果评价</label>
                            <select class="form-select" name="effectiveness" required>
                                <option value="">请选择效果评价</option>
                                <option value="excellent">显著改善</option>
                                <option value="good">有所改善</option>
                                <option value="fair">略有改善</option>
                                <option value="poor">无明显改善</option>
                                <option value="tbd">尚无结论</option>
                            </select>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-success" onclick="submitFinish()">确认完成</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- 更新补给信息模态框 -->
    <div class="modal fade" id="updateSupplyModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">更新补给信息</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <form id="updateSupplyForm">
                        <div class="mb-3">
                            <label class="form-label">物资名称</label>
                            <input type="text" class="form-control" name="productName" value="{{supplyInfo.product_name}}" placeholder="例如：BF839益生菌">
                        </div>
                        <div class="mb-3">
                            <label class="form-label">物流单号</label>
                            <input type="text" class="form-control" name="trackingNumber" value="{{supplyInfo.tracking_number}}" placeholder="例如：SF1234567890">
                        </div>
                        <div class="mb-3">
                            <label class="form-label">物流公司</label>
                            <input type="text" class="form-control" name="trackingCompany" value="{{supplyInfo.tracking_company}}" placeholder="例如：顺丰速运">
                        </div>
                        <div class="mb-3">
                            <label class="form-label">状态</label>
                            <select class="form-select" name="status">
                                <option value="pending" {{#if (eq supplyInfo.status "pending")}}selected{{/if}}>待发货</option>
                                <option value="shipped" {{#if (eq supplyInfo.status "shipped")}}selected{{/if}}>已发货</option>
                                <option value="delivered" {{#if (eq supplyInfo.status "delivered")}}selected{{/if}}>已送达</option>
                            </select>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" onclick="updateSupply()">保存</button>
                </div>
            </div>
        </div>
    </div>

    <!-- 取消报名模态框 -->
    <div class="modal fade" id="cancelModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <form id="cancelForm">
                    <div class="modal-header">
                        <h5 class="modal-title">取消报名</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <div class="mb-3">
                            <label class="form-label">取消原因</label>
                            <select class="form-select" name="cancelReason" required>
                                <option value="">请选择取消原因</option>
                                <option value="admin_cancel">管理员取消</option>
                                <option value="personal">个人原因</option>
                                <option value="not_suitable">不符合试验条件</option>
                                <option value="duplicate">重复报名</option>
                                <option value="other">其他原因</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">详细说明</label>
                            <textarea class="form-control" name="cancelDescription" rows="3" required></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-danger" onclick="submitCancel()">确认取消</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- 将所有JS文件移到这里，并添加defer属性 -->
    <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js" defer></script>
    <script src="/apps/js/bootstrap.bundle.min.js" defer></script>
    <script src="/apps/js/wx-client-dom.js" defer></script>
    <script src="/apps/js/open-oss-img-in-modal.js" defer></script>

    {{> profile}}

    <script>
        // 页面加载时初始化备注档案列表
        document.addEventListener('DOMContentLoaded', function() {
            // 获取受试者信息及试验信息
            const subjectId = "{{subject.id}}";
            const trialId = "{{trial.id}}";
            const userId = "{{subject.user_id}}";

            // 初始化备注档案列表
            loadProfilesList(subjectId, trialId);

            // 设置添加备注按钮的点击事件
            const addProfileBtn = document.querySelector('[data-bs-target="#profileModal"]');
            if (addProfileBtn) {
                addProfileBtn.addEventListener('click', function() {
                    showProfileModal(subjectId, trialId, userId);
                });
            }
        });

        // 加载备注档案列表
        async function loadProfilesList(subjectId, trialId) {
            const profilesList = document.getElementById('profiles-list');
            if (!profilesList) return;

            try {
                const response = await fetch(`/apps/trial/subjects/${subjectId}/profiles?trial_id=${trialId}`);
                const result = await response.json();

                if (result.success) {
                    if (result.profiles.length === 0) {
                        profilesList.innerHTML = '<div class="alert alert-info">暂无备注记录</div>';
                        return;
                    }

                    let html = '<div class="list-group">';
                    result.profiles.forEach(profile => {
                        // 根据confidentiality字段获取对应的显示名称和样式
                        let secretLevelText = '普通档案';
                        let badgeClass = 'bg-secondary';

                        switch (profile.confidentiality) {
                            case 'TopSecret':
                                secretLevelText = '绝密档案';
                                badgeClass = 'bg-danger';
                                break;
                            case 'Secret':
                                secretLevelText = '机密档案';
                                badgeClass = 'bg-warning text-dark';
                                break;
                            case 'Confidential':
                                secretLevelText = '内部档案';
                                badgeClass = 'bg-info text-dark';
                                break;
                            case 'Unclassified':
                            default:
                                secretLevelText = '普通档案';
                                badgeClass = 'bg-secondary';
                                break;
                        }

                        let attachmentsHtml = '';
                        if (profile.attachment_urls) {
                            attachmentsHtml = '<div class="d-flex flex-wrap gap-2 mt-2">';
                            const urls = JSON.parse(profile.attachment_urls);
                            urls.forEach(url => {
                                attachmentsHtml += `<a href="javascript:showImagePreviewModal('${url}')" class="me-2">
                                    <img src="${url}" alt="附件" class="img-thumbnail" style="width: 80px; height: 80px; object-fit: cover;">
                                </a>`;
                            });
                            attachmentsHtml += '</div>';
                        }

                        // 使用add_time字段，转换为可读的日期时间
                        const createdAt = new Date(profile.add_time * 1000).toLocaleString();

                        html += `
                        <div class="list-group-item">
                            <div class="d-flex justify-content-between align-items-center">
                                <small class="text-muted">${createdAt} · ${profile.operator_name || '系统'} · <span class="badge ${badgeClass}">${secretLevelText}</span></small>
                            </div>
                            <p class="mb-1 mt-2">${profile.content}</p>
                            ${attachmentsHtml}
                        </div>`;
                    });
                    html += '</div>';

                    profilesList.innerHTML = html;
                } else {
                    profilesList.innerHTML = `<div class="alert alert-danger">${result.message || '加载备注列表失败'}</div>`;
                }
            } catch (error) {
                console.error('加载备注列表失败:', error);
                profilesList.innerHTML = '<div class="alert alert-danger">加载备注列表失败，请重试</div>';
            }
        }

        // 提交分组设置
        function submitGroup() {
            const form = document.getElementById('groupForm');
            const subjectId = form.subjectId.value;
            const groupNo = form.groupNo.value;
            const groupType = form.groupType.value;
            const groupNote = form.groupNote.value;

            if (!groupNo || !groupType) {
                alert('请填写完整信息');
                return;
            }

            fetch(`/apps/trial/subjects/${subjectId}/group`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    groupNo,
                    groupType,
                    groupNote
                })
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('分组设置成功');
                    location.reload();
                } else {
                    alert('分组设置失败: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('操作失败，请重试');
            });
        }

        // 提交退出试验
        function submitExit() {
            const form = document.getElementById('exitForm');
            const reason = form.exitReason.value;
            const description = form.exitDescription.value;

            if (!reason || !description) {
                alert('请填写完整信息');
                return;
            }

            fetch(`/apps/trial/subjects/{{subject.id}}/exit`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    reason,
                    description
                })
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('退出试验操作成功');
                    location.reload();
                } else {
                    alert('操作失败: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('操作失败，请重试');
            });
        }

        // 提交完成试验
        function submitFinish() {
            const form = document.getElementById('finishForm');
            const summary = form.finishSummary.value;
            const effectiveness = form.effectiveness.value;

            if (!summary || !effectiveness) {
                alert('请填写完整信息');
                return;
            }

            fetch(`/apps/trial/subjects/{{subject.id}}/finish`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    summary,
                    effectiveness
                })
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('完成试验操作成功');
                    location.reload();
                } else {
                    alert('操作失败: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('操作失败，请重试');
            });
        }

        // 更新状态
        function updateStatus(subjectId) {
            fetch(`/apps/trial/subjects/${subjectId}/update-status`, {
                method: 'POST'
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('状态更新成功');
                    location.reload();
                } else {
                    alert('状态更新失败: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('操作失败，请重试');
            });
        }

        // 更新补给信息
        function updateSupply() {
            const form = document.getElementById('updateSupplyForm');
            const status = form.status.value;
            const trackingNumber = form.trackingNumber.value;
            const trackingCompany = form.trackingCompany.value;
            const productName = form.productName.value;

            fetch(`/apps/trial/subjects/{{subject.id}}/update-supply`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    status,
                    trackingNumber,
                    trackingCompany,
                    productName
                })
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('补给信息更新成功');
                    location.reload();
                } else {
                    alert('补给信息更新失败: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('操作失败，请重试');
            });
        }

        // 提交取消报名
        function submitCancel() {
            const form = document.getElementById('cancelForm');
            const reason = form.cancelReason.value;
            const description = form.cancelDescription.value;

            if (!reason || !description) {
                alert('请填写完整信息');
                return;
            }

            fetch(`/apps/trial/subjects/{{subject.id}}/cancel`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    reason,
                    description
                })
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert('取消报名操作成功');
                    location.reload();
                } else {
                    alert('操作失败: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('操作失败，请重试');
            });
        }

    </script>
</body>
</html>
